import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'dva';
import _ from 'lodash';
import { Tooltip } from 'antd';
import { SelectC } from '../..';
import SppiTest from '../../../routes/PortfolioMnt/sppiTestRecord/sppiTestNew';
import './index.less';
import edit1 from '@/src/assets/comps/business/toolTipEdit.png';
import { formSelectData } from '../../../utils/utils';

class SppIResultC extends React.Component {
  constructor() {
    super();
    this.state = {
      addSPPIFlag: false, // sppi弹窗
      dataSource: [],
    };
  }

  static defaultProps = {
    title: 'SPPI结果',
    initialValue: undefined, // 初始值
    disabled: true, // 下拉框的禁用状态
    selectProps: {
      SPPI_result: undefined, // sppi结果的值
      SppItype: 3, // 每个页面 有固定的值   2是编辑页面 1或者3目前是新增
      SecuritiesCode: undefined, // 证券代码相关的信息 是一个对象包括exchangeCode、tradingCode
      rightContentShow: true, // 右侧按钮是否展示
      sppITitle: '新增测试', // sppi点击按钮弹窗中的标题
    },
    onChange: () => {}, // 点击改变
    onOk: () => {}, // 点击弹窗中保存成功后
    onCancel: () => {}, // 点击弹窗中取消后保存
    onRef: () => {}, // 组件引用
    getInfo: () => {}, // 获取表单中的值
    reset: () => {}, // 重置
    setSelect: () => {}, // 塞值
  };

  componentDidMount() {
    this.props.onRef && this.props.onRef(this);
    // 模板字典sppi结果字典
    const {
      globalM: {
        dataDictionary: { SPPI_RESULT = [] },
      },
    } = this.props;
    // eslint-disable-next-line react/no-did-mount-set-state
    this.setState({
      dataSource: formSelectData(SPPI_RESULT),
    });
  }

  // 重置的方法
  reset = () => {
    const { dataIndex, form } = this.props;
    form.resetFields([dataIndex]);
  };

  // // 抛出表单中的值
  // getInfo = () => {
  //   const { validateFieldsAndScroll } = this.props.form;
  //   let query;
  //   validateFieldsAndScroll((err, fieldsValue) => {
  //     if (!err) {
  //       query = fieldsValue;
  //     }
  //   });
  //   return query;
  // };

  // 抛出表单中的值
  getInfo = async () => {
    try {
      await this.props.form.validateFields();
      const fieldsValue = this.props.form.getFieldsValue();
      let query;
      return (query = fieldsValue);
    } catch (err) {
      this.onFinishFailed(err);
    }
  };

  onFinishFailed = (err) => {
    const { scrollToField } = this.props.form;
    scrollToField(err[(0).name]);
  };

  // 塞值的方法
  setSelect = (value) => {
    const { form, dataIndex } = this.props;
    form.setFieldsValue({
      [dataIndex]: value,
    });
  };

  // 点击新增sppi测试+
  addSPPI = () => {
    const { SPPI_result, SecuritiesCode } = this.props.selectProps;
    if (SPPI_result || !SecuritiesCode) return;
    this.setState({
      addSPPIFlag: true,
    });
  };

  rightContent = () => {
    const { sppITitle, SecuritiesCode, SPPI_result } = this.props.selectProps;
    return (
      <div className='flotRight'>
        <div>
          <Tooltip placement='top' title={sppITitle} overlayStyle={{ background: '#fff' }}>
            <div className='btnPlus' onClick={this.addSPPI} style={{ cursor: !SPPI_result && SecuritiesCode ? 'pointer' : 'not-allowed' }}>
              <img src={edit1}></img>
            </div>
          </Tooltip>
        </div>
      </div>
    );
  };

  render() {
    const { addSPPIFlag, dataSource } = this.state;
    const {
      onChange,
      title,
      initialValue,
      disabled,
      dataIndex,
      selectProps: { SppItype, sppITitle, SecuritiesCode, rightContentShow },
    } = this.props;
    return (
      <>
        <SelectC
          form={this.props.form}
          dataIndex={dataIndex}
          title={title}
          disabled={disabled}
          initialValue={initialValue}
          dataSource={dataSource}
          rightContent={rightContentShow && this.rightContent()}
          onChange={onChange}
          {...this.props}
        />
        <SppiTest
          form={this.props.form}
          title={sppITitle}
          visible={addSPPIFlag}
          type={SppItype}
          exchangeCode={SecuritiesCode?.exchangeCode}
          tradingCode={SecuritiesCode?.tradingCode}
          onOk={() => {
            this.setState({ addSPPIFlag: false }, () => {
              this.props.onOk && this.props.onOk();
            }); // 新增完了 重新获取结果
          }}
          onCancel={() => {
            this.setState({ addSPPIFlag: false }, () => {
              this.props.onCancel && this.props.onCancel();
            });
          }}
        />
      </>
    );
  }
}
SppIResultC.propsTypes = {
  title: PropTypes.string,
  disabled: PropTypes.bool, // 下拉框的禁用状态
  rightContentShow: PropTypes.bool, // 右侧的按钮是否展示出来
  SPPI_result: PropTypes.string, // sppi结果的值
  type: PropTypes.number,
  SecuritiesCode: PropTypes.string, // 证券代码相关的信息 是一个对象包括exchangeCode、tradingCode
  sppITitle: PropTypes.string, // sppi点击按钮弹窗中的标题
};
export default connect(({ SppIResultM, globalM }) => ({ SppIResultM, globalM }))(SppIResultC);
